 <meta charset="utf-8">
 <div class="box" id="biz_authUser_roleAssign_conatainer" style="height: 600px;overflow-y: scroll;">
            <div class="box-header with-border">
               <form id="searchForm" role="form" class="form-inline">
                    <div class="form-group">
                      <div class="form-group">
                         <label>角色名称</label>
                         <input name="name" v-model="searchForm.name"   type="text" placeholder="" class="form-control  input-sm">
                    </div>
                    <label>角色代码</label>
                         <input name="roleCode" v-model="searchForm.roleCode"  id="roleCode" type="text" placeholder="" class="form-control  input-sm">
                    </div>
                     <div class="form-group" >
					 <label>所属应用</label>
						 <select id="appKey" v-model="searchForm.appKey"  name="appKey" v-kselect="{url:'auth/authApp/loadAuthAppComboboVo',vmodel:'searchForm.appKey',firstEmpty:'false'}" class=" form-control"> </select>
					</div>
                     <div class="form-group">
                    <label>是否启用</label>
                          <select class="form-control"  v-model="searchForm.enabled"  name="enabled" >
                        		  <option value="">请选择</option>
                                  <option value="true">启用</option>
                                  <option value="false">禁用</option>
                           </select>
                    </div>
                     <button type="button"  class="btn btn-info pull-right m-t-n-xs" v-kperms="{perm:'authRole:loadAuthRoleList'}"  v-on:click="search();"><strong>查询</strong></button>
                </form>
            </div>
 <div class="box-body">
 	                           <div class="btn-group " id="authRoleAssignTableToolbar" role="group">
 	                           		<button type="button" v-kperms="{perm:''}"  class="btn btn-default" v-on:click="addRolesToUser">
                                        <i class="glyphicon glyphicon-plus" aria-hidden="true"></i> 添加
                                    </button>
                                    <button type="button"  v-kperms="{perm:''}" class="btn btn-default" v-on:click="removeRolesFromUser">
                                        <i class="glyphicon glyphicon-trash" aria-hidden="true"></i> 移除
                                    </button>
                                     
                           </div>
                                
           <table id="ahthUserRoleAssignTable" data-mobile-responsive="true" ></table>
 </div>
 </div>

<script> 
new Vue({  
	  el: '#biz_authUser_roleAssign_conatainer',  
	  data:{
		  searchForm:{
			  isInUser:true,
			  userId: undefined,
			  name: undefined,
			  roleCode: undefined,
			  appKey: undefined,
			  enabled: undefined
		  },
		  bus:new Vue(),
	  },
	  mounted:function(){
		 let _this=this;
		 _this.bus.$on(zfesVueDirective.getKselectOnInitEventName("appKey"), function (msg) {
			 let param=zfesLayerEditDg.getLayerParam();//roleId
			 _this.searchForm.userId=param.userId;
				_this.initTable();
		 });
	  },
  methods: {
	  initTable:function(){
		  let columns=[
				{checkbox:true},
				{field:'roleCode',title:'角色编码',width:160,sortable:true},
				{field:'name',title:'角色名称',width:160},
				{field:'enabled',title:'是否启用',width:100,formatter:zfesUtil.formatEnabled},
				{field:'appName',title:'所属应用',width:100}];
		  let url="auth/authUser/loadRoleDataSetForUserAssign";
  		zfesBstable.vueLoadTable($("#ahthUserRoleAssignTable"),$("#authRoleAssignTableToolbar"),url,columns,this.searchForm);
	  },
	  search:function(){
		  zfesBstable.reload($("#ahthUserRoleAssignTable")); 
	  },
	  refresh:function(){
		  zfesBstable.refresh($("#ahthUserRoleAssignTable"));
	  },
	  	addRolesToUser: function(){
	  		let _this=this;
	    	let url="/view/auth/authUser/authUser.roleAssign.lookback.html";
	    	let param={userId:_this.searchForm.userId}
	    	zfesLayerEditDg.lookback(url, param, "选择角色", 1000, function() {
	    		_this.refresh();
	    	});
	  	  },
	  	removeRolesFromUser: function(){
	  	 	 if(zfesBstable.isSelectedRow($("#ahthUserRoleAssignTable"))){
				  let ids=zfesBstable.getRowIds($("#ahthUserRoleAssignTable"));
				  let　_this=this;
					 alertSwal.confirm("移除该角色","是否执行该操作",function(){
						    let ajaxUrl = "auth/authUser/removeRoleFromUser";
						    zfesAjax.ajaxTodo(ajaxUrl, { "roleIds" : ids,"userId":_this.searchForm.userId}, function(data) {
								alertSwal.successText(data.message);
								_this.refresh();
						});
			  		});
			  }
	  	  }
	   }
});
</script>


